<template>
  <div>
    <i-dialog
      :title="title"
      :visible="visible"
      width="392px"
      :close-on-click-modal="false"
      @close="outerClose"
    >
      <div class="block">
        <el-date-picker
          v-model="date"
          type="date"
          placeholder="选择添加日期"
          format="yyyy 年 MM 月 dd 日"
          value-format="timestamp"
          style="width: 100%"
        >
        </el-date-picker>
      </div>

      <span slot="footer" class="dialog-footer">
        <el-button @click="outerClose">取 消</el-button>
        <el-button type="primary" @click="submit">确认</el-button>
      </span>
    </i-dialog>
  </div>
</template>
<script>
import { updateCreateTime } from '@/api/device'
export default {
  name: 'timeSelectionDialog',
  components: {},
  props: {
    visible: {
      type: Boolean,
      required: true,
    },
    portsList: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {
      title: '修改添加日期',
      date: '',
    }
  },
  computed: {},
  watch: {},
  created() {},
  methods: {
    submit() {
      if (this.date) {
        console.log(this.date)
        let params = {
          deviceId: this.portsList.deviceId,
          createTime: this.date,
        }
        updateCreateTime(params)
          .then(() => {
            this.$message({
              message: '修改成功',
              type: 'success',
            })
            this.$emit('update:visible', false)
            this.$emit('refresh')
          })
          .catch((err) => console.log(err))
      } else {
        this.$message({
          message: '请选择日期',
          type: 'warning',
        })
      }
    },
    outerClose() {
      this.$emit('update:visible', false)
    },
  },
}
</script>
<style lang="scss" scoped>
.block {
  width: 100%;
}
</style>
